<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">
    <title>2017吉他女声-报名</title>
    <link rel="stylesheet" href="/static/h5/css/form/form.css">
    @include('web.baidu')
</head>
<body>
@include('h5.weichatshare')
@include('h5.header',['nav' => 1])
<div class="guitar-main" id="enterpage">
    <header>
        <img src="/static/h5/images/common/bg_enter.jpg">
        <span class="main">
				<em class="icon icon-txt-n animated fadeInDown"></em>
			</span>
    </header>
    <form id="form" name="baoming" action="/action/baoming" method="post">
        <section>
            <div class="section" id="type">
                <p class="title"><i>*</i>参赛形式：</p>
                <p class="radio clearfix">
                    <label class="clearfix" type="personal">
                        <input class="hidden" type="radio" name="type" checked value="1"/>
                        <em class="icon-radio"></em>
                        <span>个人参赛</span>
                    </label>
                    <label class="clearfix" type="team">
                        <input class="hidden" type="radio" name="type" value="2"/>
                        <em class="icon-radio"></em>
                        <span>组合参赛</span>
                    </label>
                </p>
            </div>
            <div id="typeclass">
                <div class="section">
                    <p class="title"><i>*</i>参赛者姓名：</p>
                    <p class="input"><input name="relname" type="text"/></p>
                </div>
                <div class="section">
                    <p class="title"><i>*</i>主唱年龄：</p>
                    <p class="input"><input name="age" type="text"/></p>
                </div>
            </div>
        </section>
        <section>
            <div class="section">
                <p class="title"><i>*</i>参赛曲目：</p>
                <p class="input"><input name="song" type="text"/></p>
            </div>
            <div class="section">
                <p class="title"><i>*</i>是否原创：</p>
                <p class="radio clearfix">
                    <label class="clearfix">
                        <input class="hidden" name="yuanchuang" value="1" type="radio" checked/>
                        <em class="icon-radio"></em>
                        <span>是</span>
                    </label>
                    <label class="clearfix">
                        <input class="hidden" name="yuanchuang" value="0" type="radio"/>
                        <em class="icon-radio"></em>
                        <span>否</span>
                    </label>
                </p>
            </div>
            <div class="section">
                <p class="title"><i>*</i>视频链接：</p>
                <div class="link clearfix">
                    <label class="clearfix">
                        <input class="hidden" name="link" type="radio" checked/>
                        <em class="icon-radio"></em>
                        <span>现在粘贴：请在下框中粘贴参赛视频链接（任何视频平台均可，视频标题中需含有【吉他女声】字样）</span>
                    </label>
                    <p class="input"><input name="video" type="text"/></p>
                    <label class="clearfix">
                        <input class="hidden" name="link" type="radio"/>
                        <em class="icon-radio"></em>
                        <span>稍后发送，成功上传视频后将链接发送至邮箱：comboevent-SMB@music.yamaha.com（（任何视频平台均可，视频标题中需含有【吉他女声】字样）</span>
                    </label>
                </div>
            </div>
            <div class="section">
                <p class="title"><i>*</i>联系方式：</p>
                <p class="input"><input name="mobile" value="" type="text"/></p>
            </div>
            <div class="section">
                <p class="title"><i>*</i>邮箱：</p>
                <p class="input"><input name="email" type="text"/></p>
            </div>

            <div class="section">
                <p class="title"><i>*</i>从何渠道知晓本次活动：</p>
                <p class="radio clearfix">

                    @foreach($source as $k => $v)
                        <label class="clearfix">
                            <input class="hidden" name="source" value="{{$v}}" type="radio" @if($k==0) checked @endif/>
                            <em class="icon-radio"></em>
                            <span>{{$v}}</span>
                        </label>
                    @endforeach

                </p>
            </div>
            <div class="section" style="margin-top: 5px;">
                    <label class="clearfix">
                        <input class="hidden" name="source" value="0" type="radio"/>
                        <em class="icon-radio"></em>
                        <span>其他</span>
                        <input type="text" name="source_other" style="border: 1px solid #ddd;line-height: 30px;text-indent: 10px;" placeholder="填写其他途径"  >
                    </label>
            </div>
            <div class="section">
                <p class="title"><i>*</i><input type="checkbox" name="clause" value="1" checked>我已阅读并接受<a href="/mobile/clause" style="color:#333">《隐私条款》</a></p>

            </div>

        </section>
        <input type="hidden" name="_token" value="{{csrf_token()}}"/>
        <input type="hidden" name="isMobile" value="1"/>
    </form>
    <a class="btn" href="javascript:baoming.submit();">提交</a>
</div>
<script type="text/template" id="personalTpl">
    <div class="section">
        <p class="title"><i>*</i>参赛者姓名：</p>
        <p class="input"><input name="relname" type="text"/></p>
    </div>
    <div class="section">
        <p class="title">主唱年龄：</p>
        <p class="input"><input name="age" type="text"/></p>
    </div>
</script>
<script type="text/template" id="teamTpl">
    <div class="section">
        <p class="title"><i>*</i>参赛者姓名<em>1</em>：</p>
        <p class="input"><input name="relname" type="text"/></p>
    </div>

    <div class="section">
        <p class="title"><i>*</i>参赛者姓名<em>2</em>：</p>
        <p class="input"><input name="relname2" type="text"/></p>
    </div>
    <div class="section">
        <p class="title"><i>*</i>参赛者姓名<em>3</em>：</p>
        <p class="input"><input name="relname3" type="text"/></p>
    </div>
    <div class="section">
        <p class="title">主唱年龄：</p>
        <p class="input"><input name="age" type="text"/></p>
    </div>

</script>
<script type="text/javascript" src="/static/h5/js/lib/jquery/jquery-2.0.3.min.js"></script>
<script type="text/javascript">
    $(function () {
        var tpl = {
            personalTpl: $('#personalTpl').html(),
            teamTpl: $('#teamTpl').html()
        }
        $('#type').on('click', 'label', function () {
            $('#typeclass').html(tpl[$(this).attr('type') + 'Tpl']);
        });
    })
</script>
</body>
</html>